import React, { useState } from 'react'
import './Navbar.scss'
import { NavLink } from 'react-router-dom'
import { menu } from '../../router'

export default function Navbar(props) {
  const [categoryList] = useState(menu)
  return (
    <div className='navbar main-padding-left'>
        {
        categoryList.map(item => {
          return (
            <div className='nav-item' key={item.path}>
                <NavLink className="nav-link" activeClassName="nav-link-active" to={item.path} exact>{item.title}</NavLink>
            </div>
          )
        })
      }
    </div>
  )
}
